<template>
	<view class="cu-modal drawer-modal justify-end" :class="[visible?'show':'']" @click="hideModal">
		<view class="cu-dialog statt-top" @click.stop="">
			<view class="statt-head  text-black">
				审批记录
			</view>
			<view class="cu-timeline">
				<view class="cu-item cur cuIcon-noticefill text-blue" v-for="item in list" :key='item.id'>
					<view class="statt-text text-black">
						时间：{{item.time}}
					</view>
					<view class="statt-text text-black">
					 审批人：{{item.userId}}
					</view>
					<view class="statt-text text-black">
						审批环节：{{item.taskId}}
					</view>
					<view class="statt-text text-black"  v-if="item.message!=''">
						审批意见：{{item.message}}
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {getRemarkInfo} from "../../api/service.js"
	export default{
		data(){
			return {
				visible:false,
				list:[]
			}
		},
		methods:{
			show(id,processId){
				this.visible=true;
				// this.entityType=entityType;
				this.$nextTick(()=>{
					this.queryRemarkInfo(processId)
				})
			},
			hideModal(){
				this.list=[];
				this.visible=false;
				
			},
			queryRemarkInfo(pid){
				console.log('获取流程ID'+pid)
				getRemarkInfo({id:pid}).then(res=>{
					if(res.result&&res.result.length>=0){
						this.list=res.result; 
					}
				})
			}
		},
		
	}
</script>

<style>
	.statt-head{
		line-height: 60rpx;
		padding-left:20rpx;
		text-align: left;
		background: #fff;
		margin-bottom: 16rpx;
		font-size: 30rpx;
	}
	
	.statt-top{
		width: 560rpx!important;
		max-width: 560rpx!important;
		position: fixed;
		right: 0;
		top: 76rpx;
		bottom: 0;
		overflow: scroll;
		z-index: 10;
	}
 .cu-timeline>.cu-item{
	 padding: 16rpx 10rpx 10rpx 40rpx;
 }
 .cu-timeline>.cu-item::before{
	 left:16rpx;
	 top:16rpx;
 }
 .cu-timeline>.cu-item::after{
	 left:40rpx;
 }
 .statt-text{
 	 line-height: 42rpx;
 	 text-align: left;
 	 padding-left: 30rpx;
	 min-height: 50rpx;
 }
</style>
